$(function(){
	// 异步请求 async: 值为true时为异步请求，为false时同步请求
	var obj = $.ajax({
		type:"get",
		url:"js/fm.json",
		async:false,
		success:function(response,stutas,xhr){
			console.log(response);
		},
		error:function(){
			console.log("error");
		}
	})
	function goodView(e){
		this.img = e.src;
		this.tname = e.tname;
		this.author = e.author;
		this.status = e.status;
		this.num = e.num;
		this.update = e.update;
		this.play = e.play;
	}
	goodView.prototype = {
		init:function(){
			$(`<li class="view_item">
					<img src="`+this.img+`" class="view_img">
					<div class="view_title">`+this.tname+`</div>
					<div class="view_author">`+this.author+`</div>
				</li>`).appendTo($(".view_list"));
		},
		rankinitF:function(){
			$(`<li>
					<span class="icon iconrank1"></span>
					<img src="`+this.img+`" class="rank_cover">
					<p class="rank_info column">
						<span class="rank_name">`+this.tname+`</span>
						<span class="status">`+this.status+`</span>
					</p>
				</li>`).appendTo($(".rank_ul"));
		},
		rankinitS:function(){
			$(`<li>
					<span class="icon rank_num">`+this.num+`</span>
					<p class="rank_info">
						<span class="rank_name">`+this.tname+`</span>
						<span class="status">`+this.status+`</span>
					</p>
				</li>`).appendTo($(".rank_ul"));
		},
		
		recommendF:function(){
			$(`<div class="recommend_list_item floatleft">
				<a href="#">
					<img src="`+this.img+`" class="re_img">
					<div class="update_info">`+this.update+`</div>
					<div class="albums_tt">`+this.tname+`</div>
				</a>
				<div class="statistics">总播放量：`+this.play+`</div>
			</div>`).appendTo($(".recommend_list"));
		}
	}
	// var arrview = obj.responseJSON.result.goodview;
	// console.log(arrview)
	// 精品周更 
	$.each(obj.responseJSON.result.goodview,function(i,e){
		var view = new goodView(e);
		view.init();
	})
	
	var i=0;
	$(".next").click(function(){
		i++;
		$(".view_list").css("margin-left",-i*875+"px");
		$(".prev").css("display","block");
		$(".prev").css("opacity","0.7");
		if(i==4){
			$(".next").css("opacity","0");
			i=3;
		}
	})
	$(".prev").click(function(){
		i--;
		$(".view_list").css("margin-left",-i*875+"px");
		$(".next").css("opacity","0.7");
		if(i==0){
			$(".prev").css("opacity","0");
			$(".prev").css("display","none");
			i=0;
		}
	})
	var p = ["-410px -70px/461px 439px","-410px -102px/461px 439px","-410px -134px/461px 439px"]
	$.each(obj.responseJSON.result.rank,function(i,e){
		var view = new goodView(e);
		if(i<3){
			view.rankinitF();
			$(".icon").eq(i).css({"background": "url(imgs/sprite-icons@svg.fca430a4.svg) "+p[i]+""})
		}else{
			// view.rankinitS();
			$(`<li>
					<span class="icon rank_num">`+(i+1)+`</span>
					<p class="rank_info">
						<span class="rank_name">`+e.tname+`</span>
						<span class="status">`+e.status+`</span>
					</p>
				</li>`).appendTo($(".rank_ul"));
		}
		
		// console.log(e);
	})
	
	// 热门音单 
	$.each(obj.responseJSON.result.album,function(i,e){
		// var view = new goodView(e);
		$(`<div class="thumbnail_albums floatleft">
				<a href="#">
					<img src="`+e.src+`" class="albums_img">
					<div class="sound_count">`+e.num+`</div>
					<div class="albums_tt">`+e.tname+`</div>
				</a>
				<div class="statistics">总播放量：`+e.play+` 万</div>
			</div>`).appendTo($(".album"));
	})
	
	// 猜你喜欢
	$.each(obj.responseJSON.result.like,function(i,e){
		$(`<li class="like_content">
				<a href="#">`+e.tname+`</a>
				<p class="icon_info">
					<span class="viewcount">`+e.playnum+`</span>
					<span class="commentcount">`+e.comment+`</span>
				</p>
			</li>`).appendTo($(".like_inner"));
	})
	
	// 为你推荐
	var r_list = obj.responseJSON.result.recommend;
	$.each(r_list.popular,function(i,e){
		// var r_list = obj.responseJSON.result.recommend;
		// console.log(r_list)
		var view = new goodView(e);
		view.recommendF();
		
	})
	
	var re_arr = ["popular","pay","yanqing","newworks","manhua"];
	$.each($(".tabs_item"),function(i,e){
		$(".tabs_item").eq(i).click(function(){
			$.each(r_list[re_arr[i]],function(i,e){
				$(".recommend_list_item .re_img").eq(i).attr("src",e.src);
				$(".recommend_list_item .update_info").eq(i).text(e.update);
				$(".recommend_list_item .albums_tt").eq(i).text(e.tname);
				$(".recommend_list_item .statistics").eq(i).text("总播放量："+e.play);
			})
			$(".tabs_item").eq(i).addClass("tab_hover").siblings().removeClass("tab_hover");
		})
	})
	
	// 有声漫画
	$.each(obj.responseJSON.result.comic,function(i,e){
		$(`<li class="block_inner_item floatleft">
				<div class="box_img">
					<img src="`+e.src+`" class="lazy_img">
					<p class="sound_time">`+e.time+`</p>
				</div>
				<p class="item_tt">`+e.tname+`</p>
				<p class="icon_info item_info">
					<span class="viewcount">`+e.play+`</span>
					<span class="commentcount">`+e.comment+`</span>
				</p>
			</li>`).appendTo($("#comic"));
	})
	
	// 广播剧
	var radio_arr = ["tuijian","allage","bl","bg"];
	$.each(obj.responseJSON.result.radioplay.tuijian,function(i,e){
		$(`<li class="block_inner_item floatleft">
				<div class="box_img">
					<img src="`+e.src+`" class="lazy_img">
					<p class="sound_time">`+e.time+`</p>
				</div>
				<p class="item_tt">`+e.tname+`</p>
				<p class="icon_info item_info">
					<span class="viewcount">`+e.play+`</span>
					<span class="commentcount">`+e.comment+`</span>
				</p>
			</li>`).appendTo($("#radio"));
	})
	$.each($(".tab_item_tt"),function(i,e){
		$(".tab_item_tt").eq(i).click(function(){
			$.each(obj.responseJSON.result.radioplay[radio_arr[i]],function(i,e){
				// console.log(1);
				$("#radio .lazy_img").eq(i).attr("src",e.src);
				$("#radio .sound_time").eq(i).text(e.time);
				$("#radio .item_tt").eq(i).text(e.tname);
				$("#radio .viewcount").eq(i).text(e.play);
				$("#radio .commentcount").eq(i).text(e.comment);
			})
			$(".tab_item_tt").eq(i).addClass("tab_item_tt_active").siblings().removeClass("tab_item_tt_active");
		})
	})
	
	// 音乐
	var music_arr = ["tuijian","juqing","erci","OP"];
	var musicObj = obj.responseJSON.result.music;
	$.each(musicObj.tuijian,function(i,e){
		$(`<li class="block_inner_item floatleft">
				<div class="box_img">
					<img src="`+e.src+`" class="lazy_img">
					<p class="sound_time">`+e.time+`</p>
				</div>
				<p class="item_tt">`+e.tname+`</p>
				<p class="icon_info item_info">
					<span class="viewcount">`+e.play+`</span>
					<span class="commentcount">`+e.comment+`</span>
				</p>
			</li>`).appendTo($("#musicul"));
	})
	$.each($("#music .tab_item_tt"),function(i,e){
		$("#music .tab_item_tt").eq(i).click(function(){
			$.each(musicObj[music_arr[i]],function(i,e){
				console.log(1);
				$("#musicul .lazy_img").eq(i).attr("src",e.src);
				$("#musicul .sound_time").eq(i).text(e.time);
				$("#musicul .item_tt").eq(i).text(e.tname);
				$("#musicul .viewcount").eq(i).text(e.play);
				$("#musicul .commentcount").eq(i).text(e.comment);
			})
			$("#music .tab_item_tt").eq(i).addClass("tab_item_tt_active").siblings().removeClass("tab_item_tt_active");
		})
	})
	
	// 排行榜
	var rank = obj.responseJSON.result.paihang;
	$.each($(".block_tab"),function(i,e){
		// $(e).index();
		$(e).attr("index",i);
		// console.log(e);
		
	})
	
	$.each(rank.mhpaihang.week,function(i,e){
		// console.log(e);
		if(i<1){
			Add(e);
		}else{
			$(`<li class="ranklist_item">
					<div class="ranklist_num floatleft">`+(i+1)+`</div>
					<div class="rankitem_info">
						<p class="rank_tname">`+e.pname+`</p>
					</div>
				</li>`).appendTo($("#comicrank .ranklist"));
		}
	})
	
	$.each(rank.radioph.week,function(i,e){
		// console.log(e);
		if(i<1){
			AddR(e);
		}else{
			$(`<li class="ranklist_item">
					<div class="ranklist_num floatleft">`+(i+1)+`</div>
					<div class="rankitem_info">
						<p class="rank_tname">`+e.pname+`</p>
					</div>
				</li>`).appendTo($("#radiorank .ranklist"));
		}
	})
	
	$.each(rank.radioph.week,function(i,e){
		// console.log(e);
		if(i<1){
			$(`<li class="ranklist_item">
					<div class="ranklist_num floatleft">`+(i+1)+`</div>
					<div class="floatleft rankitem_img">
						<img src="`+e.src+`">
					</div>
					<div class="rankitem_info">
						<p class="rank_p">`+e.tname+`</p>
						<p class="icon_info">
							<span class="viewcount">`+e.num+`</span>
							<span class="commentcount">`+e.comment+`</span>
						</p>
					</div>
				</li>`).appendTo($("#musicrank .ranklist"));
		}else{
			$(`<li class="ranklist_item">
					<div class="ranklist_num floatleft">`+(i+1)+`</div>
					<div class="rankitem_info">
						<p class="rank_tname">`+e.pname+`</p>
					</div>
				</li>`).appendTo($("#musicrank .ranklist"));
		}
	})
	// 排行榜按钮
	var datearr = ["week","day"];
	$.each($("#comicrank .block_tab"),function(i,e){
		$("#comicrank .block_tab").eq(i).click(function(){
			$.each(rank.mhpaihang[datearr[i]],function(i,e){
				// console.log(1);
				if(i<1){
					$("#comicrank .rankitem_img>img").eq(0).attr("src",e.src);
					$("#comicrank .rank_p").eq(0).text(e.tname);
					$("#comicrank .viewcount").eq(0).text(e.play);
					$("#comicrank .commentcount").eq(0).text(e.comment);
				}else{
					$("#comicrank .rank_tname").eq(i-1).text(e.pname);
				}
			})
			$("#comicrank .block_tab").eq(i).addClass("fc_change").siblings().removeClass("fc_change");
		})
	})
	$.each($("#radiorank .block_tab"),function(i,e){
		$("#radiorank .block_tab").eq(i).click(function(){
			$.each(rank.radioph[datearr[i]],function(i,e){
				if(i<1){
					$("#radiorank .rankitem_img>img").eq(i).attr("src",e.src);
					$("#radiorank .rank_p").eq(i).text(e.tname);
					$("#radiorank .viewcount").eq(i).text(e.play);
					$("#radiorank .commentcount").eq(i).text(e.comment);
				}else{
					$("#radiorank .rank_tname").eq(i-1).text(e.pname);
				}
			})
			$("#radiorank .block_tab").eq(i).addClass("fc_change").siblings().removeClass("fc_change");
		})
	})
	$.each($("#musicrank .block_tab"),function(i,e){
		$("#musicrank .block_tab").eq(i).click(function(){
			$.each(rank.radioph[datearr[i]],function(i,e){
				if(i<1){
					$("#musicrank .rankitem_img>img").eq(i).attr("src",e.src);
					$("#musicrank .rank_p").eq(i).text(e.tname);
					$("#musicrank .viewcount").eq(i).text(e.play);
					$("#musicrank .commentcount").eq(i).text(e.comment);
				}else{
					$("#musicrank .rank_tname").eq(i-1).text(e.pname);
				}
			})
			$("#musicrank .block_tab").eq(i).addClass("fc_change").siblings().removeClass("fc_change");
		})
	})
	
	function Add(e){
		$(`<li class="ranklist_item">
				<div class="ranklist_num floatleft">`+(i+1)+`</div>
				<div class="floatleft rankitem_img">
					<img src="`+e.src+`">
				</div>
				<div class="rankitem_info">
					<p class="rank_p">`+e.tname+`</p>
					<p class="icon_info">
						<span class="viewcount">`+e.num+`</span>
						<span class="commentcount">`+e.comment+`</span>
					</p>
				</div>
			</li>`).appendTo($("#comicrank .ranklist"));
	}
	function AddR(e){
		$(`<li class="ranklist_item">
				<div class="ranklist_num floatleft">`+(i+1)+`</div>
				<div class="floatleft rankitem_img">
					<img src="`+e.src+`">
				</div>
				<div class="rankitem_info">
					<p class="rank_p">`+e.tname+`</p>
					<p class="icon_info">
						<span class="viewcount">`+e.num+`</span>
						<span class="commentcount">`+e.comment+`</span>
					</p>
				</div>
			</li>`).appendTo($("#radiorank .ranklist"));
	}
	
	var fontcolor = ["#ffb938","#b1c3d6","#dac49a","#d4d4d4","#d4d4d4"];
	$.each($("#comicrank .ranklist_num"),function(i,e){
		$("#comicrank .ranklist_num").eq(i).css("background",fontcolor[i]);
	})
	$.each($("#radiorank .ranklist_num"),function(i,e){
		$("#radiorank .ranklist_num").eq(i).css("background",fontcolor[i]);
	})
	$.each($("#musicrank .ranklist_num"),function(i,e){
		$("#musicrank .ranklist_num").eq(i).css("background",fontcolor[i]);
	})
	
	
	
})